<template>
    <el-button type="primary" style="margin-left: 16px" @click="regDrawer = true">
        注册
    </el-button>

    <el-drawer
            v-model="regDrawer"
            title="I am the title"
            :with-header="false"
            direction="ltr"
    style="text-align: center; background-color: rgba(0, 0, 0, 0.1);">
        <h1 style="font-size: 40px;color: #ffffff">注册</h1>
        <el-button style="margin-left: 16px" @click="loginDrawerByReg = true">
            已有账号？立即登录
        </el-button>

        <el-drawer
            v-model="loginDrawerByReg"
            title="I am the title"
            :with-header="false"
            direction="ltr"
        style=" background-color: rgba(0, 0, 0, 0.8);">
            <h1 style="font-size: 40px;color: #f4f4f5">登录</h1>
            <Login/>
        </el-drawer>
        <reg/>
    </el-drawer>
</template>

<script setup>
import Reg from "@/components/Reg.vue";
import {ref} from "vue";
import Login from "@/components/Login.vue";

const regDrawer = ref(false)


const loginDrawerByReg = ref(false)
</script>

<style scoped>

</style>